
<!DOCTYPE html>
	<!--[if lt IE 7]>      <html class="no-js lt-ie9 lt-ie8 lt-ie7"> <![endif]-->
	<!--[if IE 7]>         <html class="no-js lt-ie9 lt-ie8"> <![endif]-->
	<!--[if IE 8]>         <html class="no-js lt-ie9"> <![endif]-->
	<!--[if gt IE 8]><!--> <html class="no-js"> <!--<![endif]-->
	<head>
	<meta charset="utf-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<title>相约享阅，享悦人生</title>
	<meta name="viewport" content="width=device-width, initial-scale=1">
	<meta name="description" content="相约享阅，享悦人生" />
	<meta name="keywords" content="淡香雅,相约享阅，享悦人生" />
	

  

  	<!-- Facebook and Twitter integration -->
	<meta property="og:title" content=""/>
	<meta property="og:image" content=""/>
	<meta property="og:url" content=""/>
	<meta property="og:site_name" content=""/>
	<meta property="og:description" content=""/>
	<meta name="twitter:title" content="" />
	<meta name="twitter:image" content="" />
	<meta name="twitter:url" content="" />
	<meta name="twitter:card" content="" />

	<!-- Place favicon.ico and apple-touch-icon.png in the root directory -->
	<link rel="shortcut icon" href="favicon.ico">
	<!-- <link href='https://fonts.googleapis.com/css?family=Varela+Round' rel='stylesheet' type='text/css'> -->
	
	<!-- Animate.css -->
	<link rel="stylesheet" href="css/animate.css">
	<!-- Icomoon Icon Fonts-->
	<link rel="stylesheet" href="css/icomoon.css">
	<!-- Bootstrap  -->
	<link rel="stylesheet" href="css/bootstrap.css">
	<!-- Theme style  -->
	<link rel="stylesheet" href="css/style.css">

	<!-- Owl Carousel  -->
	<link rel="stylesheet" href="css/owl.carousel.min.css">
	<link rel="stylesheet" href="css/owl.theme.default.min.css">

	<!-- Modernizr JS -->
	<script src="js/modernizr-2.6.2.min.js"></script>
	<!-- FOR IE9 below -->
	<!--[if lt IE 9]>
	<script src="js/respond.min.js"></script>
	<![endif]-->

	</head>
	<body>
	
	<header id="fh5co-header">
		<div class="container">
			<div class="col-md-6 col-sm-6">
				<div class="intro">
					<h1 id="fh5co-logo"><a href="index.html">享阅</a></h1>
					<h2>一个免费的图书共享平台。分享阅读，快乐成长！</h2>
					<p>
						<a href="#" class="btn btn-primary"><i class="icon-apple"></i>苹果</a>
						<a href="#" class="btn btn-success"><i class="icon-android"></i>安卓</a>
					</p>
				</div>
			</div>
			<div class="col-md-6 col-sm-6">
				<figure class="fh5co-intro-img">
					<img class="img-1 animate-box" src="images/screenshot_1.jpg" alt="Free Website Template by FreeHTML5.co">
					<img class="img-2 animate-box hidden-xs" src="images/screenshot_2.jpg" alt="Free Website Template by FreeHTML5.co">
				</figure>
			</div>
		</div>
	</header>

	<div id="main">

		<div class="container">

			<div class="row fh5co-feature">
				<div class="col-md-6 col-md-push-6">
					<div class="fh5co-copy">
						<div class="fh5co-copy-inner">
							<h2>保持简洁</h2>
							<p>保持简洁，避免繁琐！我想要的现在就要，想做的现在就做。</p>
						</div>
					</div>
				</div>
				<div class="col-md-6 col-md-pull-6">
					<div class="fh5co-img">
						<figure class="fh5co-figure animate-box">
							<img class="img-2" src="images/screenshot_1.jpg" alt="Free Website Template by FreeHTML5.co">	
						</figure>
					</div>
				</div>
			</div>
			<!-- END feature -->

			<div class="row fh5co-feature fh5co-reverse">
				<div class="col-md-6">
					<div class="fh5co-copy">
						<div class="fh5co-copy-inner">
							<h2>方便快捷</h2>
							<p>图书联盟，你想要的就在这里！</p>
						</div>
					</div>
				</div>
				<div class="col-md-6">
					<div class="fh5co-img">
						<figure class="fh5co-figure animate-box">
							<img class="img-2" src="images/screenshot_2.jpg" alt="Free Website Template by FreeHTML5.co">	
						</figure>
					</div>
				</div>
			</div>
			<!-- END feature -->

			<div class="row fh5co-feature last-feature">
				<div class="col-md-6 col-md-push-6">
					<div class="fh5co-copy">
						<div class="fh5co-copy-inner">
							<h2>淡香优雅</h2>
							<p>一缕阳光，一抹书香！岁月安得如此静美？尽在分享阅读。</p>
						</div>
					</div>
				</div>
				<div class="col-md-6 col-md-pull-6">
					<div class="fh5co-img">
						<figure class="fh5co-figure animate-box">
							<img class="img-2" src="images/screenshot_3.jpg" alt="Free Website Template by FreeHTML5.co">	
						</figure>
					</div>
				</div>
			</div>
			<!-- END feature -->

		
		</div>


		<div class="fh5co-testimonial">
			<div class="container">
				<div class="row text-center fh5co-heading">
					<h2>Customer Review</h2>
				</div>
				<div class="owl-carousel owl-carousel-fullwidth">
					<div class="item">
						<div class="testimony-slide active text-center">
							<figure>
								<img src="images/person_1.jpg" alt="user">
							</figure>
							<span>Jean Doe </span>
							<span class="review">
								<i class="icon-star colored"></i>
								<i class="icon-star colored"></i>
								<i class="icon-star colored"></i>
								<i class="icon-star colored"></i>
								<i class="icon-star"></i>
							</span>
							<blockquote>
								<p>&ldquo;Far far away, behind the word mountains, far from the countries Vokalia and Consonantia, there live the blind texts. Separated they live in Bookmarksgrove right at the coast of the Semantics, a large language ocean.&rdquo;</p>
							</blockquote>
						</div>
					</div>
					<div class="item">
						<div class="testimony-slide active text-center">
							<figure>
								<img src="images/person_2.jpg" alt="user">
							</figure>
							<span>John Doe </span>
							<span class="review">
								<i class="icon-star colored"></i>
								<i class="icon-star colored"></i>
								<i class="icon-star colored"></i>
								<i class="icon-star colored"></i>
								<i class="icon-star colored"></i>
							</span>
							<blockquote>
								<p>&ldquo;Separated they live in Bookmarksgrove right at the coast of the Semantics, a large language ocean.&rdquo;</p>
							</blockquote>
						</div>
					</div>
					<div class="item">
						<div class="testimony-slide active text-center">
							<figure>
								<img src="images/person_3.jpg" alt="user">
							</figure>
							<span>Rob Smith </span>
							<span class="review">
								<i class="icon-star colored"></i>
								<i class="icon-star colored"></i>
								<i class="icon-star colored"></i>
								<i class="icon-star colored"></i>
								<i class="icon-star colored"></i>
							</span>
							<blockquote>
								<p>&ldquo;Far from the countries Vokalia and Consonantia, there live the blind texts. Separated they live in Bookmarksgrove right at the coast of the Semantics, a large language ocean.&rdquo;</p>
							</blockquote>
						</div>
					</div>
				</div>
			</div>
		</div>

		<div id="features">
			<div class="container">
				<div class="row text-center fh5co-heading">
					<div class="col-md-8 col-md-offset-2">
						<h2>More Features</h2>
						<p>Far far away, behind the word mountains, far from the countries Vokalia and Consonantia, there live the blind texts.</p>
					</div>
				</div>
				<div class="row">
					<div class="col-md-3 animate-box">
						<div class="feature-center">
							<span class="icon">
								<i class="icon-tablet"></i>
							</span>
							<h3>Fully Responsive</h3>
							<p>Far far away, behind the word mountains, far from the countries Vokalia and Consonantia</p>
						</div>
					</div>
					<div class="col-md-3 animate-box">
						<div class="feature-center">
							<span class="icon">
								<i class="icon-heart"></i>
							</span>
							<h3>Love by everyone</h3>
							<p>Far far away, behind the word mountains, far from the countries Vokalia and Consonantia</p>
						</div>
					</div>
					<div class="col-md-3 animate-box">
						<div class="feature-center">
							<span class="icon">
								<i class="icon-star"></i>
							</span>
							<h3>Good Review</h3>
							<p>Far far away, behind the word mountains, far from the countries Vokalia and Consonantia</p>
						</div>
					</div>
					<div class="col-md-3 animate-box">
						<div class="feature-center">
							<span class="icon">
								<i class="icon-cog"></i>
							</span>
							<h3>API</h3>
							<p>Far far away, behind the word mountains, far from the countries Vokalia and Consonantia</p>
						</div>
					</div>
				</div>
			</div>
		</div>
		
		<div id="get-started">
			<div class="container">
				<div class="row text-center fh5co-heading">
					<div class="col-md-8 col-md-offset-2">
						<h2>Subscribe</h2>
						<p>Far far away, behind the word mountains, far from the countries Vokalia and Consonantia, there live the blind texts.</p>
					</div>
				</div>
				<div class="get-started">
					<form class="form-inline">
						<div class="col-md-4 col-sm-4">
							<div class="form-group">
								<label for="name" class="sr-only">Name</label>
								<input type="text" class="form-control" id="name" placeholder="Name">
							</div>
						</div>
						<div class="col-md-4 col-sm-4">
							<div class="form-group">
								<label for="email" class="sr-only">Email</label>
								<input type="email" class="form-control" id="email" placeholder="Email">
							</div>
						</div>
						<div class="col-md-4 col-sm-4">
							<button type="submit" class="btn btn-default btn-block">Subscribe</button>
						</div>
					</form>
				</div>
			</div>
		</div>

		<footer id="footer">
			<div class="container">
				<div class="col-md-12 text-center">
					<p class="copyright">
						<small>&copy; 2016. Free HTML5 Template. All Rights Reserved.</small>
						<em><small>Designed by <a href="#" target="_blank">Freehtml5</a> More Templates <a href="http://www.cssmoban.com/" target="_blank" title="模板之家">模板之家</a> - Collect from <a href="http://www.cssmoban.com/" title="网页模板" target="_blank">网页模板</a></small></em>
					</p>
					<ul class="fh5co-social">

						<li><a href="#"><i class="icon-facebook"></i></a></li>
						<li><a href="#"><i class="icon-twitter"></i></a></li>
						<li><a href="#"><i class="icon-linkedin"></i></a></li>
						<li><a href="#"><i class="icon-apple"></i></a></li>
					</ul>
				</div>
			</div>
		</footer>
	</div>
	
	<!-- jQuery -->
	<script src="js/jquery.min.js"></script>
	<!-- jQuery Easing -->
	<script src="js/jquery.easing.1.3.js"></script>
	<!-- Bootstrap -->
	<script src="js/bootstrap.min.js"></script>
	<!-- Waypoints -->
	<script src="js/jquery.waypoints.min.js"></script>
	<!-- Carousel -->
	<script src="js/owl.carousel.min.js"></script>

	<!-- MAIN JS -->
	<script src="js/main.js"></script>

	</body>
</html>

